디렉토리(아키텍처) 구조

생각 정리

1. src 폴더를 만드는게 좋을까? 만약 만든다면 src 안에 app을 넣고 app 안에 모든 폴더를 넣는게 좋을까? 아니면 src를 두고 src 안에 app, hooks, utils를 나누는게 좋을까?

   • 이미 app 라우터로 코드를 분리하는데 src로 한 번 더 감싸서 depth를 추가해야될까? 규모도 그리 크지 않은데.. 이렇게 까진 안 해도 될 것 같음.

2. lib에는 뭘 넣는게 좋을까?

   • ui와 직접적으로 관련되지 않은 것들
   • api, utils, constants, types

3. 현재 서비스에 domain을 어떻게 나눌 수 있을까?

   1. main, root: main page, ad, recommended
   2. deal: deal page, daily, brand
   3. product: review, detail
   4. cart

4. hooks는 루트 디렉토리로 따로 빼는게 좋을까? 아니면 lib에 hooks를 넣는게 좋을까? 아님 도메인별로 관리하는게 좋을까?

   • 도메인별로 hook을 관리했을 때 장/단점

     • 장점
       • 높은 응집도
       • 직관적
     • 단점
       • 중복 코드 발생 가능성
       • 전역 관리 어려움

   • 루트에 hook을 관리했을 때 장/단점

     • 장점
       • 중앙 집중식
       • 전역 관리 쉬움
     • 단점
       • 낮은 응집도
       • 복잡성 증가

   • lib 디렉토리 안에 hook을 관리했을 때 장/단점

     • 장점
       • 도메인 관련 없는 범용 유틸 훅은 lib에,
         앱 전반의 전역 훅은 app 안에.
     • 단점
       • 초기 설계가 중요하고
         도메인 관련 구분이 애매함

   • 이번 프로젝트에는 도메인별로 상태가 관리돼서 이동되기 때문에 도메인별로 hook을 관리하는게 더 적합할 것 같다 생각함.

   1. Q. point 관련 hook은 장바구니를 제외하고 전역에서 관리되는데 어케하는게 좋을까?
      • global hooks에 넣자니 장바구니에선 안 쓰이고, 그렇다고 point가 도메인을 따로 분리할만큼인가?
      • 현재 클론 프로젝트에서는 포인트가 다양하게 쓰이진 않지만, 실제 프로덕트에서는 보통 포인트 유효기간도 관리해야되고 프로모션 포인트도 있고 다양하게 관리되니까 하나의 도메인으로 치는게 맞는거 아닐까 생각했음
   2. Q. 장바구니에 담긴 프로덕트 상태는 전역에서 관리되어야 하는데 cart 도메인에 훅을 넣는게 맞나?
      • 상태 자체를 접근할 수 있는건 여러 곳이지만
      • 해당 상태의 핵심 책임은 "장바구니" 도메인이기에 cart에 두는게 맞을 것 같음.
      • 이래야 응집도도 높으니까.

0710 기준 디렉토리 구조

- app  
	- layout.tsx  
	- page.tsx  
	- components  
		- AdBanner.tsx  
		- RecommendedProducts.tsx  
		- SwipeContainer.tsx  
		- AppHeader.tsx // appname, appcart  
		- AppNavbar.tsx // main <-> deal  
	- hooks // root hooks  
		- useAppNavigation.tsx // main <-> deal, swipe or touch or click

	- (deal)  
		- components  
			- DealNavbar.tsx // Daily <-> Brand, touch or click  
			- DailyProducts.tsx  
			- BrandProducts.tsx	  
		- hooks  
			- useDealTimer.tsx

	- (point)  
		- components  
			- PointDisplay.tsx  
		- hooks  
			- usePointTimer.tsx  
			- useScrollActivity.tsx

	- product  
		- [id]  
			- page.tsx  
		- components  
			- ProductNavbar.tsx  
			- ProductReview.tsx  
			- ProductDetail.tsx  
			- ProductQuantitySelector.tsx // 수량 선택  
			- ProductOptionSelector.tsx // 옵션 선택  
		- forms  
			- AddToCartForm.tsx // 장바구니에 상품 담기  
		- hooks  
			- useProductNavgation.tsx // review <-> detail, swipe or touch or click  
			- useProductDetail.tsx // option + qunatity  
			- useProductOptions.tsx  
			- useProductQuantity.tsx  
			  
	
	- cart  
		- page.tsx  
		- components  
			- CartProducts.tsx  
			- CartProductsSummary.tsx  
		- hooks  
			- useCartProductsStore.tsx  
			- useCartProductSelection.tsx // cart products 선택, 해제

- ui  
	- Button.tsx  
	- form.tsx  
- lib  
	- api  
	- utils  
	- constants  
	- types

0716 기준 디렉토리 구조

• 0716 til